<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<style>
		#app{
			width:50rem;
			height: 50rem;
			background-color: red;
		}
		@media (min-width:1923px){
			#app{
				width:200rem;
				height: 300rem;		
			}
		}
	</style>
	<body>
		<div id="app">
			
		</div>
		<script>
			 function checkFull () {
			      //判断浏览器是否处于全屏状态 （需要考虑兼容问题）
			      //火狐浏览器
			      let isFull =
			        document.mozFullScreen ||
			        document.fullScreen ||
			        //谷歌浏览器及Webkit内核浏览器
			        document.webkitIsFullScreen ||
			        document.webkitRequestFullScreen ||
			        document.mozRequestFullScreen ||
			        document.msFullscreenEnabled;
			      if (isFull === undefined) {
			        isFull = false;
			      }
			      return isFull;
			    }
			window.addEventListener('resize',function() {
				console.log('发生热resize')
				console.log(checkFull())
			});
			</script>
	</body>
</html>